import React, { memo } from 'react'
import { NavLink } from 'react-router-dom'
import { renderRoutes } from 'react-router-config'

import { BackTop } from 'antd';
import {
  DiscoverWrapper,
  TopMenu
} from './style'
import { discoverMenu } from '@/common/local-data'


export default memo(function DDiscover(props) {


  return (
    <DiscoverWrapper>
      <div className="top">
        <TopMenu className="wrap-v1">
          {
            discoverMenu.map((item, index) => {
              return (
                <div className="item" key={item.title}>
                  <NavLink to={item.link}>{item.title}</NavLink>
                </div>
              )
            })
          }
        </TopMenu>
      </div>
      {renderRoutes(props.route.routes)}
        <BackTop visibilityHeight={0} duration={30}>
          <div className="sprite_backTop top-button" title="回到顶部"></div>
        </BackTop>
    </DiscoverWrapper>
  )
})
